﻿<template>
<div>
  <el-breadcrumb separator="/">
    <el-breadcrumb-item :to="{ path: '/home' }">首页</el-breadcrumb-item>
    <el-breadcrumb-item>打印管理</el-breadcrumb-item>
    <el-breadcrumb-item>入库单</el-breadcrumb-item>
  </el-breadcrumb>
  <div class="btn" >
    <el-button  type="info" @click="download" >打印入库单</el-button>
  </div>
  <div style="margin-top:25px">
   <el-table :header-cell-style="{background:'rgb(55,61,65)',color:'#fff','text-align':'center'}"
    :data="inOrderList"
    height="350"
    :cell-style="{'text-align':'center'}"

    style="width: 100%">
    <el-table-column
      prop="listNumber"
      label="采购单据号"
      width="320">
    </el-table-column>
    <el-table-column
      prop="entryDate"
      label="入库时间"
      width="320">
    </el-table-column>
    <el-table-column
      prop="totalPrice"
      label="总金额"
      width="320">
    </el-table-column>
    <el-table-column
      prop="head"
      label="负责人"
      width="320">
    </el-table-column>
    <el-table-column
      prop="remarks"
      label="备注">
    </el-table-column>
  </el-table>
  <!-- <el-button type="success" @click="htmlToExcel('#printTest', '表格')">导出Excel</el-button> -->
  </div>
</div>
</template>

<script>
import * as XLSX from 'xlsx'
export default {
  components: {},
  props: {},
  data() {
    return {
      inOrderList:[]
      // tableData: [{
      //     list_number: '2016-05-03',
      //     entry_date: '王小虎',
      //     total_price: '上海市普陀区金沙江路 1518 弄',
      //     head:'晶晶',
      //     remarks:'冷藏',

      //   }, {
      //      list_number: '2016-05-03',
      //     entry_date: '王小虎',
      //     total_price: '上海市普陀区金沙江路 1518 弄',
      //     head:'晶晶',
      //     remarks:'冷藏',
      //   }, {
      //     list_number: '2016-05-03',
      //     entry_date: '王小虎',
      //     total_price: '上海市普陀区金沙江路 1518 弄',
      //     head:'晶晶',
      //     remarks:'冷藏',
      //   }, {
      //      list_number: '2016-05-03',
      //     entry_date: '王小虎',
      //     total_price: '上海市普陀区金沙江路 1518 弄',
      //     head:'晶晶',
      //     remarks:'冷藏',
      //   }, {
      //     list_number: '2016-05-03',
      //     entry_date: '王小虎',
      //     total_price: '上海市普陀区金沙江路 1518 弄',
      //     head:'晶晶',
      //     remarks:'冷藏',
      //   }, {
      //      list_number: '2016-05-03',
      //     entry_date: '王小虎',
      //     total_price: '上海市普陀区金沙江路 1518 弄',
      //     head:'晶晶',
      //     remarks:'冷藏',
      //   }, {
      //       list_number: '2016-05-03',
      //     entry_date: '王小虎',
      //     total_price: '上海市普陀区金沙江路 1518 弄',
      //     head:'晶晶',
      //     remarks:'冷藏',
      //   }],
    };
  },
  watch: {},
  computed: {},
  methods: {
     async getInOrderList(){
      const{data:res} = await this.$http.get('myblog/storage/list')
      if(res.code!==200){
        return this.$message.error('数据获取错误')
      }
      this.inOrderList = res.data
      console.log(res.data[1].entryDate);
      this.$message.success('数据获取成功')
    },
    download() {
      const data = XLSX.utils.json_to_sheet(this.inOrderList)
      const wb = XLSX.utils.book_new()
      XLSX.utils.book_append_sheet(wb, data, 'kalacloud-data')
      XLSX.writeFile(wb, '入库单.xlsx')
    },
  },
  created() {
    this.getInOrderList()
  },
  mounted() {}
};
</script>
<style lang="less" scoped>
// .wrapper{}\
.btn{
  position: absolute;
  top:68px;
  right: 20px;
}
</style>
